<template>
  <el-container>
      <el-header>
          <Tabs :userName="userName"/>
      </el-header>
      <HeaderTop :flag="true"/>
      <el-main>
          <el-row class="top">
            <h3>查询关键字:"{{text}}"</h3>
          </el-row>
          <el-row class="middle">
            <el-col :span="8" :offset="8">
              <img width="100%" src="http://10.203.0.101:9000/static/img/404.5127a38.png" alt="">
            </el-col>
            <el-col class="text">未找到</el-col>
          </el-row>
      </el-main>
      <el-footer>
        全国高职院校Web应用软件开发技能竞赛
      </el-footer>
  </el-container>

</template>

<script>
import HeaderTop from '../HeaderTop/HeaderTop.vue'
import Tabs from '../Tabs/Tabs.vue'
export default {
  components: { Tabs, HeaderTop },
  data(){
    return {
      text:'',
      userName:''
    }
  },
  mounted(){
    let {search} = this.$route.query
    this.text = search
    let name =  localStorage.getItem('userName') 
    this.userName = name
  }
}
</script>

<style scoped>
.el-container{
  position: relative;
  min-height: 100%;
}
.el-header{
  padding: 0px;
}
.el-main{
  padding: 0px;
}
.top{
  margin: 50px 0;
  height: 80px;
  background: rgba(0, 0, 0, 0.2);
}
.top h3{
  padding: 0px 70px;
  line-height: 80px;
}
.text{
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  color: #333;
}
.el-footer{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #bfa;
    text-align: center;
    line-height: 50px;
}
</style>